<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="../static/img/favicon.ico"/>
    <title>知天下事</title>
    <link rel="stylesheet" type="text/css" href="/static/css/main.css">
    {#        <link rel="stylesheet" type="text/css" href="../static/css/jquery.pagination.css">#}
    <link rel="stylesheet" type="text/css" href="/static/css/reset.css">
    <script src="/static/js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="/static/js/index.js" type="text/javascript" charset="utf-8"></script>
    <style type="text/css">
        #d1 {
            height: 100%;
            width: 60%;
            margin: 0px auto;
        {#border: #000000 1px solid;#}

        }

        #d2 {
            width: 860px;
            height: 30px;
            position: relative;
            top: -10px;
        }

        .form-horizontal {
            width: 80%;
            margin: 0px auto;
            display: block;
        }

        .float-L {
            width: 80%;
            height: 30px;
            border: #888888 2px solid;
            background: #f1f2f6;
            border-radius: 10px;
            outline: none;
            margin: 0px auto;
            display: inline-block;
            /* border: 0px; */

        }

        .float-r {
            width: 80px;
            height: 32px;
        {#background:whit#} border: #888888 2px solid;
            background: #f1f2f6;
            margin: 0px auto;
            /* border: r 5px solid; */
            border-radius: 10px;
            display: inline-block;
            cursor: pointer;
            outline: none;

        }

        .refresh {
            width: 35px;
            height: 35px;
            float: right;
        }

    </style>
</head>
<body>

<div id="d1">
    <ul class="menu">
        {% for category in categories %}
            <li class="{% if forloop.counter == old %}active{% endif %}" data-cid="{{ category.id }}"><a
                    href="javascript:;">{{ category.name }}</a></li>
        {% endfor %}
    </ul>
    <div id="d2">
        <div class="form-horizontal">
            <input class="float-L" type="text" placeholder="请输入关键字" name="text" id="fouc1" value="">
            <input class="float-r" type="button" value="搜索" id="click1">
            <img src="/static/img/refresh.png" class="refresh">
        </div>
    </div>
    <ul class="list_con fl">
        <li>

</div>
<a href="/  " style="position: fixed;top: 0px;right: 0px;"><img src="/static/img/back.png" style="width: 60px;
            height: 60px;"></a>

</body>
</html>